import { useEffect } from "react";
import { View } from "@tarojs/components";
import { observer } from "mobx-react-lite";
import { useStore } from "../../mobx-rootstore";
import { IndexStore } from "./index.store";

import styles from "./index.module.scss";

const Index = () => {
  const store = useStore(IndexStore);
  useEffect(() => {
    store.sdkInit();
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  return (
    <View className={styles.pages}>
      <View>设备列表</View>
      {store.scanDeviceList?.map(v => {
        return (
          <View className={styles.deviceList} key={v.deviceId}>
            <View>设备名称：{v.name}</View>
            <View>mac:{v.mac}</View>
            <View>
              <View
                onClick={() => {
                  store.getbindDevice(v.mac!);
                }}
              >
                绑定
              </View>
            </View>
          </View>
        );
      })}
    </View>
  );
};

export default observer(Index);
